<template>
  <div>
    <div class="header">
      <div class="max">
        <div class="logo" @click="start">
          <img src="@/assets/images/logo.png" alt />
        </div>
        <div class="zcan">
          <a href="http://8.143.3.120/login">登录</a>
          <a href="http://8.143.3.120/register">注册</a>
        </div>
      </div>
    </div>

    <div class="nav">
      <ul class="max">
        <li
          v-for="(item, i) in navData"
          :class="{ selected: active === i }"
          :key="i"
          @click="$router.push({ path: item.path }), (active = i)"
        >
          {{ item.name }}
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
import { useRouter } from "vue-router";
import { defineComponent } from "vue";
export default defineComponent({
  setup() {
    //初始化路由
    const router = useRouter();
    console.log(router);
    const start = () => {
      router.push("/");
    };
    return { start };
  },

  data() {
    return {
      active: 0,
      navData: [
        { name: "首页", path: "/" },
        { name: "新闻通知", path: "/b" },
        { name: "采购规则", path: "/ab" },
        { name: "采购公告", path: "/" },
        { name: "合同公告", path: "/" },
        { name: "供应商", path: "/" },
        { name: "代理机构", path: "/" },
      ],
    };
  },
  computed: {},
  methods: {},
});
</script>

<style scoped></style>
